<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单验证</title>
    <script src="jquery-3.4.1/jquery-3.4.1.js"></script>
    <script src="jquery-validation-1.14.0/lib/jquery.js"></script>
    <script src="jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
    <script src="jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
    <script>
       /* $.validator.setDefaults({
            submitHandler: function() {
                alert("提交事件!");
            }
        });
        $().ready(function() {
            $("#commentForm").validate();
        });
        $(function(){
            $("#cell").validate({
                rules: {
                    new_phone : {
                        required : true,
                        minlength : 11,
                        isMobile : true
                    },
                },
                messages: {
                    new_phone : {
                        required : "请输入手机号",
                        minlength : "不能小于11个字符",
                        isMobile : "请正确填写手机号码"
                    },

                },
            });
        //手机号码验证
        jQuery.validator.addMethod("isMobile", function(value, element) {
            var length = value.length;
            var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
            return this.optional(element) || (length == 11 && mobile.test(value));
        }, "请正确填写手机号码");*/
       $(function(){
           $("#cell").validate({
               rules: {
                   new_phone : {
                       required : true,
                       minlength : 11,
                       isMobile : true
                   },
               },
               messages: {
                   new_phone : {
                       required : "请输入手机号",
                       minlength : "不能小于11个字符",
                       isMobile : "请正确填写手机号码"
                   }
               },
           });
       })

       //手机号码验证
       jQuery.validator.addMethod("isMobile", function(value, element) {
           var length = value.length;
           var mobile = /^(?![0-9]+$)(?![a-zA-Z]+$)[A-Za-z0-9\\W]{1,}$/;
           return this.optional(element) || (length == 11 && mobile.test(value));
       }, "请正确填写手机号码");
    </script>
</head>
<body>
<!--<div class="edit_phone1 tis_edit">
    <form  id="cell" class="form-horizontal" method="get" action="">
        <input type="text" id="new_phone" name="new_phone" autofocus="autofocus">
    </form>
</div>-->
<!--<form action="" method="post" id="myform">
    <input type="text" name="phone" placeholder="请输入手机号码" />
    <button type="submit">提交</button>
</form>-->
<div class="edit_phone1 tis_edit">
    <form  id="cell" class="form-horizontal" method="get" action="">
        <div class="select_div bkbj">
            <span style="width:86px;">原手机号码：</span>
            <input type="text" disabled="disabled" id="old_phone2">
        </div>
        <div class="select_div new-phone" style="margin-bottom: 0;">
            <span  style="width:86px;">新手机号码：</span>
            <input type="text" id="new_phone" name="new_phone" autofocus="autofocus">
        </div>
        <div style="color:red;text-align: center;">
            <p style="margin-right: 54px;">备注：新手机号码将替代原手机号码</p>
            <p style="margin-left: 17px;">该教师的登录账号将为新手机号码</p>
        </div>
    </form>
</div>
</body>
</html>